<template>
  <el-row class="w-100 p-3 ">
    <el-col :span="24" class="p-2">
      <el-form>
        <table border="1" class="WarnSetTable ur-table" width="100%" style="border: 1px solid #132b91">
          <tr height="50">
            <td class="w120 text-right px-2">* 用户名称：</td>
            <td class="px-2">
              <el-input placeholder="请输入内容" class="w-100" size="small" v-model="user.Name"></el-input>
            </td>
            <td  class="w120 text-right px-2">* 启用状态：</td>
            <td class="px-2">
              <el-select v-model="user.Enabled" class="w-100" size="small" >
                <el-option label="启用" :value="1"></el-option>
                <el-option label="禁用" :value="0"></el-option>
              </el-select>
            </td>
          </tr>
          <tr height="50">
            <td class="w120 text-right px-2">* 角色类型：</td>
            <td class="px-2">
              <el-tooltip class="item" :content="errors.first('userRoleId')" :value="errors.has('userRoleId')" :manual="true">
                <el-select v-model="user.RoleType" class="w-100" size="small" name="userRoleId"  v-validate="'required'">
                  <el-option label="业主" :value="0" ></el-option>
                  <el-option label="养护单位" :value="1" ></el-option>
                </el-select>
              </el-tooltip>
            </td>
            <td class="w120 text-right px-2">* 登录密码：</td>
            <td class="px-2">
              <el-tooltip class="item" :content="errors.first('userPwd')" :value="errors.has('userPwd')" :manual="true">
                <el-input type="password" placeholder="请输入内容" class="w-100" size="small" v-model="user.Pwd"
                :class="{'is-error':errors.has('userPwd')}" v-validate="'required|loginPwd'" name="userPwd"></el-input>
              </el-tooltip>
            </td>
          </tr>
          <tr height="50">
            <td class="w120 text-right px-2">* 手机号：</td>
            <td colspan="3" class="px-2">
              <el-tooltip class="item" :content="errors.first('Mobile')" :value="errors.has('Mobile')" :manual="true">
                <el-input v-model="user.Mobile" size="small" placeholder="请输入内容" class="input-with-select w-100"
                          :class="{'is-error':errors.has('Mobile')}" v-validate="'required|smsPhone'" name="Mobile"></el-input>
              </el-tooltip>
            </td>
          </tr>
          <tr height="50">
            <td class="w120 text-right px-2">* 邮箱：</td>
            <td colspan="3" class="px-2">
              <el-tooltip class="item" :content="errors.first('Mail')" :value="errors.has('Mail')" :manual="true">
                <el-input v-model="user.Mail" size="small" placeholder="请输入内容" class="input-with-select w-100"
                          :class="{'is-error':errors.has('Mail')}" v-validate="'required|email'" name="Mail"></el-input>
              </el-tooltip>
            </td>
          </tr>
          <tr height="50">
            <td class="w120 text-right px-2">是否接收短信：</td>
            <td colspan="3" class="px-2">
              <el-radio v-model="user.SmsEnabled" :label="1">是</el-radio>
              <el-radio v-model="user.SmsEnabled" :label="0">否</el-radio>
            </td>
          </tr>
          <tr height="50" v-show="user.SmsEnabled==1">
            <td class="w120 text-right px-2">报警等级：</td>
            <td colspan="3" class="px-2">
              <el-checkbox v-model="user.SmsLevel1">重大报警</el-checkbox>
              <el-checkbox v-model="user.SmsLevel2">一般报警</el-checkbox>
              <el-checkbox v-model="user.SmsLevel3">一般事件</el-checkbox>
            </td>
          </tr>
          <tr height="50">
            <td class="w120 text-right px-2">备注：</td>
            <td colspan="3" class="p-2">
              <el-input  type="textarea" v-model="user.Remark" size="small" placeholder="请输入内容" class="input-with-select w-100"></el-input>
            </td>
          </tr>
        </table>
        <div class="w-100 text-center mt-3">
          <el-button class="ur-btn ur-btn-primary" @click="save"><i class="iconfont icon-sure"></i>确定</el-button>
          <el-button class="ur-btn ur-btn-primary"><i class="iconfont icon-close3"></i>取消</el-button>
        </div>
      </el-form>

    </el-col>
  </el-row>

</template>

<script>

  import api from 'api/api'

  export default {
    props: {
      user:{},
    },
    data() {
      return {
        ajaxServe:api.ajaxServe,
        value:'',
        SmsLevel:[],
        // SmsEnabled:0
      }
    },
    watch: {
    },
    computed: {
    },
    methods: {
      uploadFiles(){
        if (event.target.files&&['jpg', 'png', 'jpeg'].lastIndexOf(event.target.files[0].name.split('.')[0]) === -1) {
          return this.$message.warning({showClose:true,message:'文件类型不符合'})
        }else{
          this.user['file'] = event.target.files[0]
        }
      },
      save() {
        for(let i=1;i<=3;i++){
          if(this.user['SmsEnabled']==0){//不接收短信
            this.user['SmsLevel'+i]=0
          }else{
            this.user['SmsLevel' + i] = this.user['SmsLevel' + i] ? 1 : 0
          }
        }
        this.$validator.validateAll().then((res) => {
          if (res) {
            let url ='/User/Insert'
            if(this.user.Id){
              url ='/User/Update'
            }
            api.fetch(url, this.user)
              .then(res => {
                if (res != ''){
                  this.$message.success({showClose:true,message:'成功'})
                  this.closeDialog()
                }
              })
          }
        })
      },
      closeDialog(){
        this.$emit('closeDialog',false)
      }
    },
    created() {
      for(let i=1;i<=3;i++){
        this.user['SmsLevel'+i]=this.user['SmsLevel'+i]==1?true:false
      }
      if(this.user.RoleName==''){
        this.user.RoleId=''
      }
    },
    mounted() {}
  }
</script>
<style lang="stylus" rel="stylesheet/stylus">

</style>
